/*
 * @Description: 元数据列表
 * @Author: Rfan
 * @Date: 2022-01-20 15:45:14
 * @LastEditTime: 2022-09-08 14:42:14
 */

import { useEffect, useState } from 'react';
import { Table, Tag } from 'antd';
import classNames from 'classnames/bind';
import { getListItemValue } from '@/utils/list';
import { useMetadataBusinessContext } from '../contexts/MetadataBusinessContext';
import BtnSwitch from './BtnSwitch';
import PaneOperate from './PaneOperate';
import type { IMetadata } from '@/interfaces/metadata';
import type { ICoordinate } from '@/interfaces/global';
import styles from '../styles/metadataPane.module.scss';

const cx = classNames.bind(styles);

const { Column } = Table;

interface IMetadataPaneProps {
  title: string;
  data: ICoordinate;
}

const MetadataPane = (props: IMetadataPaneProps) => {
  const { title, data } = props;
  const { metadataList, metadataLoading, kindList, initListQuery } = useMetadataBusinessContext();

  const [currentPage, setCurrentPage] = useState(1);

  useEffect(() => {
    initListQuery({ ...data });
    setCurrentPage(1);
  }, [data]);

  return (
    <div className={cx('metadata-pane')}>
      <PaneOperate title={title} data={data} />
      <div className={cx('container')}>
        <Table
          dataSource={metadataList}
          loading={metadataLoading}
          rowKey="id"
          pagination={{
            current: currentPage,
            onChange: (page) => {
              setCurrentPage(page);
            }
          }}
          scroll={{
            x: 'max-content'
          }}
          bordered
        >
          <Column title="编号" dataIndex="id" key="id" align="center" />
          <Column title="字段描述" dataIndex="field_desc" key="c_name" align="center" />
          <Column title="字段名称" dataIndex="field_name" key="e_name" align="center" />
          <Column
            title="字段种类"
            dataIndex="field_kind"
            key="field_kind"
            align="center"
            render={(val) => (
              <Tag color={getListItemValue(val, kindList, 'color')}>
                {getListItemValue(val, kindList)}
              </Tag>
            )}
          />
          <Column
            title="利用可见"
            dataIndex="is_use_visible"
            key="is_use_visible"
            align="center"
            render={(val, record: IMetadata) => (
              <BtnSwitch
                state={val}
                param={{ coordinate: data, field: record }}
                businessStr="is_use_visible"
              />
            )}
          />
          <Column
            title="全文检索"
            dataIndex="is_text_search"
            key="is_text_search"
            align="center"
            render={(val, record: IMetadata) => (
              <BtnSwitch
                state={val}
                param={{ coordinate: data, field: record }}
                businessStr="is_text_search"
              />
            )}
          />
          <Column
            title="关联检索"
            dataIndex="is_related_search"
            key="is_related_search"
            align="center"
            render={(val, record: IMetadata) => (
              <BtnSwitch
                state={val}
                param={{ coordinate: data, field: record }}
                businessStr="is_related_search"
              />
            )}
          />
          <Column
            title="后台列表"
            dataIndex="is_back_item"
            key="is_back_item"
            align="center"
            render={(val, record: IMetadata) => (
              <BtnSwitch
                state={val}
                param={{ coordinate: data, field: record }}
                businessStr="is_back_item"
              />
            )}
          />
          <Column
            title="后台导出"
            dataIndex="is_back_export"
            key="is_back_export"
            align="center"
            render={(val, record: IMetadata) => (
              <BtnSwitch
                state={val}
                param={{ coordinate: data, field: record }}
                businessStr="is_back_export"
              />
            )}
          />
          <Column
            title="编辑"
            dataIndex="is_update"
            key="is_update"
            align="center"
            render={(val, record: IMetadata) => (
              <BtnSwitch
                state={val}
                param={{ coordinate: data, field: record }}
                businessStr="is_update"
              />
            )}
          />
          <Column
            title="批量修改"
            dataIndex="is_update_batch"
            key="is_update_batch"
            align="center"
            render={(val, record: IMetadata) => (
              <BtnSwitch
                state={val}
                param={{ coordinate: data, field: record }}
                businessStr="is_update_batch"
              />
            )}
          />
          <Column
            title="追加复制"
            dataIndex="is_append_copy"
            key="is_append_copy"
            align="center"
            render={(val, record: IMetadata) => (
              <BtnSwitch
                state={val}
                param={{ coordinate: data, field: record }}
                businessStr="is_append_copy"
              />
            )}
          />
          <Column
            title="继承上级"
            dataIndex="is_inherit"
            key="is_inherit"
            align="center"
            render={(val, record: IMetadata) => (
              <BtnSwitch
                state={val}
                param={{ coordinate: data, field: record }}
                businessStr="is_inherit"
              />
            )}
          />
          <Column
            title="分组"
            dataIndex="is_group"
            key="is_group"
            align="center"
            render={(val, record: IMetadata) => (
              <BtnSwitch
                state={val}
                param={{ coordinate: data, field: record }}
                businessStr="is_group"
              />
            )}
          />
          <Column
            title="查找"
            dataIndex="is_search"
            key="is_search"
            align="center"
            render={(val, record: IMetadata) => (
              <BtnSwitch
                state={val}
                param={{ coordinate: data, field: record }}
                businessStr="is_search"
              />
            )}
          />
          <Column
            title="排序"
            dataIndex="is_sort"
            key="is_sort"
            align="center"
            render={(val, record: IMetadata) => (
              <BtnSwitch
                state={val}
                param={{ coordinate: data, field: record }}
                businessStr="is_sort"
              />
            )}
          />
          <Column
            title="自增"
            dataIndex="is_increment"
            key="is_increment"
            align="center"
            render={(val, record: IMetadata) => (
              <BtnSwitch
                state={val}
                param={{ coordinate: data, field: record }}
                businessStr="is_increment"
              />
            )}
          />
        </Table>
      </div>
    </div>
  );
};

export default MetadataPane;
